<template>
	<view>
		<uni-popup ref="ticket" :maskClick="false" type="center">
			<view class="ticket-wrap">
				<image :src="url" mode=""></image>
				<view class="close-icon" @click="hide"></view>
				<view class="confirm-btn" @click="handleConfirm"></view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		props: {
			url: String
		},
		data() {
			return {
				
			};
		},
		methods: {
			show() {
				this.$refs.ticket.open()
			},
			hide() {
				this.$refs.ticket.close()
			},
			handleConfirm() {
				this.$emit('confirm')
				this.hide()
			}
		}
	}
</script>

<style lang="scss" scoped>
.ticket-wrap {
	width: 561rpx;
	height: 693rpx;
	border-radius: 10rpx;
	background:linear-gradient(0deg,rgba(217,24,7,1),rgba(250,58,41,1));
	position: relative;
	.close-icon {
		position: absolute;
		top: 20rpx;
		right: 20rpx;
		z-index: 9;
		height: 40rpx;
		width: 40rpx;
		background-color: transparent;
	}
	.confirm-btn {
		position: absolute;
		bottom: 20rpx;
		left: 50%;
		transform: translateX(-50%);
		z-index: 9;
		height: 74rpx;
		width: 330rpx;
		background-color: transparent;
	}
}
</style>
